<template>
    <el-dialog
            title="用户编辑"
            :visible.sync="dialogVisible"
            @close="handleClose">
        <el-form label-width="80px">
            <el-row>
                <el-col :span="8">
                    <el-form-item label="登录名称">
                        <el-input :disabled="true" style="width: 180px"
                                  v-model="loginUserForm.loginName"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item :disabled="true" label="手机号码">
                        <el-input style="width: 180px"
                                  v-model="loginUserForm.mobile"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="邮箱">
                        <el-input style="width: 180px"
                                  v-model="loginUserForm.email"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="8">
                    <el-form-item label="帐户状态">
                        {{ loginUserForm.isDelete? '删除':'正常'}}
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item  label="性别">
                        <el-select  v-model="loginUserForm.sex" placeholder="请选择">
                            <el-option label="女" value="0"></el-option>
                            <el-option label="男" value="1"></el-option>
                            <el-option label="未知" value="2"></el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="名字">
                        <el-input style="width: 180px"
                                  v-model="loginUserForm.realName"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
        </el-form>
        <span slot="footer" class="dialog-footer">
            <el-button @click="closeDialog()">取 消</el-button>
            <el-button type="primary" @click="updateUserInfo()">确 定</el-button>
        </span>

    </el-dialog>
</template>
<script>
    import tg_enum_select from '@/components/base/TG_ENUM_SELECT'
    import user_API from '@/api/api_user'
    export default {
        data() {
            return {
                loginUserForm: {
                    sex: '1'
                }
            }
        },
        name: 'user_edit',
        components: {tg_enum_select},
        props: {
            dialogVisible: {
                type: Boolean,
                default: false
            },
            userId: {
                type: String,
                required: true
            }
        },
        methods: {
            handleClose() {
                console.info('关闭的时候触发')
            },
            closeDialog() {
                this.$emit('closeDialog',false)
            },
            getUserInfo(){
                debugger
                if (this.userId){
                    let _this = this
                    let params = { 'id': this.userId }
                    user_API.getById(params).then(res=>{
                        console.error(res)
                        Object.assign(_this.loginUserForm, res.data);
                    })
                }
            },
            updateUserInfo(){
                let _this = this
                user_API.changeProfile(this.loginUserForm).then(res=>{
                  console.info(res)
                  _this.$emit('closeDialog',false)
                  _this.$emit('setMobile', res.data.mobile)
                })
            }
        },
        created() {
          this.getUserInfo()
        },
        mounted() {
        }

    }
</script>